<template>
  <div class="contentBox">
    <div class="questRow1" @click="show">
      <h2 v-text="item.title" style="font-size:0.45rem;width:90%"></h2>
      <x-icon  v-if="!iShow" type="ios-plus-empty" size="32" ></x-icon>
      <x-icon  v-else="iShow" type="ios-close-empty" size="32" ></x-icon>
    </div>
    <pre class="questRow2" v-html="item.content" v-show="iShow"></pre>
  </div>
</template>
<script>
export default {
  components:{

  },
  props:['item'],
  data(){
    return {
      iShow:false,
    }
  },
  methods:{
    show(){
      this.iShow = !this.iShow
    }
  }
}
</script>
<style lang="less">
@import '../../../../style/mixin.less';

  .contentBox{
    .wh(100%,100%);
    padding-top: 0.4rem;
    padding-bottom: .4rem;
    .questRow1{
      .bs();
      .fx(row,space-between);
    }
    .questRow2{
      .sc(0.36rem,#939393)
    }
  }
</style>
